// colors
$colors: (
  'primary': #13D1BE,
  'ftcolor-1': #999,
  'ftcolor-2': #666,
  'ftcolor-3': #222,
  'grey': #E5E5E5,
  'bgcolor': #F8F8F8,
  'white': #fff,
  'home-nav-1': #c0aa80,
  'home-nav-2': #fe6348,
);

$border-color: map-get($colors, 'grey');

// text font-size
$font-base-size: 1rem;
$font-sizes: (
  12: 0.75,
  13: 0.8125,
  14: 0.875,
  16: 1,
  18: 1.125,
);

// flex
$flex-dir: (
  row: row,
  row-r: row-reverse,
  col: column,
  col-r: column-reverse,
);

$flex-wrap: (
  nowrap: nowrap,
  wrap: wrap,
  wrap-r: wrap-reverse,
);

$flex-jc: (
  start: flex-start,
  end: flex-end,
  center: center,
  between: space-between,
  around: space-around,
);

$flex-ai: (
  start: flex-start,
  end: flex-end,
  center: center,
  baseline : baseline ,
  stretch: stretch,
);

// space  mt-20
$spacing-types: (m: margin, p: padding);
$spacing-directions: (t: top, b: bottom, l: left, r: right);
$spacing-base-size: 1px;
$spacing-sizes: ( 0, 2, 4, 5, 8, 10, 12, 14, 16, 20, 30, 50, 100);
